<template>
	<view class="goods_list_item">
		<view class="goods_list_item__left"><image :src="goods.goods_big_logo || defaultImage" mode=""></image></view>
		<view class="goods_list_item__right">
			<view class="goods_list_item__right--name">{{ goods.goods_name }}</view>
			<view class="goods_list_item__right--price">{{ goods.goods_price.toFixed(2) }}</view>
		</view>
	</view>
</template>

<script setup lang="ts">
import { defineEmits, defineProps, PropType } from 'vue';
interface GoodsItem {
	add_time: number;
	cat_id: number;
	cat_one_id: number;
	cat_three_id: number;
	cat_two_id: number;
	goods_big_logo: string;
	goods_id: number;
	goods_name: string;
	goods_number: number;
	goods_price: number;
	goods_small_logo: string;
	goods_weight: number;
	hot_mumber: number;
	is_promote: false;
	upd_time: number;
}
defineProps({
	goods: {
		type: Object as PropType<GoodsItem>,
		default: () => ({})
	}
});
defineEmits(['']);
const defaultImage = 'https://hbimg.b0.upaiyun.com/5d91b400204034583e9c24dd4b10f225f3e59522ed9-zXPxPI_fw658';
</script>

<style lang="scss">
.goods_list_item {
	display: flex;
	justify-content: flex-start;
	padding: 10px 5px;
	border: 1px solid #f0f0f0f0;
	.goods_list_item__left {
		image {
			display: block;
			width: 100px;
			height: 100px;
		}
	}
	.goods_list_item__right {
		padding-left: 5px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-start;
		.goods_list_item__right--name {
			font-size: 13px;
		}
		.goods_list_item__right--price {
			color: #c00000;
			font-size: 16px;
			&::before {
				content: '￥';
			}
		}
	}
}
</style>
